<template>
  <div>
    <a-spin :spinning="spinning">
      <modal-dynamic-form ref="modalDynamicForm" width="60%" @beforeClose="beforeClose" @submit="submitModalFrom" title="内容管理"></modal-dynamic-form>
    </a-spin>
  </div>
</template>

<script>
  import ModalDynamicForm from '@/components/DynamicForms/ModalDynamicForm.vue'
  import {
    getFormDesign, save, update, getDetail
  } from '@/api/site/content'
  export default {
    components: {
      ModalDynamicForm
    },
    data () {
      return {
        labelCol: {
          xs: {
            span: 24
          },
          sm: {
            span: 7
          }
        },
        wrapperCol: {
          xs: {
            span: 24
          },
          sm: {
            span: 13
          }
        },
        modalTitle: '',
        rowId: null,
        status: '0',
        categoryId: null,
        modelId: null,
        modalOpera: 0, // 0：新增 1：编辑
        visible: false,
        spinning: false,
        confirmLoading: false,
        form: this.$form.createForm(this)
      }
    },
    created () {},
    methods: {
      add (pmodel, categoryId) {
        this.spinning = true
        this.modelId = pmodel.code
        this.categoryId = categoryId
        this.rowId = null
        this.getFormDesign(pmodel.code)
      },
      edit (record) {
        this.categoryId = record.categoryId
        this.modelId = record.modelId
        this.rowId = record.id
        this.status = record.status
        this.spinning = true
        getDetail({
          id: record.id
        }).then(response => {
            if (response.code === 0) {
               this.$refs.modalDynamicForm.initForm(response.res.models)
               this.spinning = false
            }
        })
      },
      getFormDesign (id) {
          getFormDesign({ modelId: id }).then(response => {
            if (response.code === 0) {
               this.$refs.modalDynamicForm.initForm(response.res)
            }
            this.spinning = false
          })
      },
      beforeClose () {
        this.$refs.modalDynamicForm.cleanForm()
      },
      submitModalFrom (data) {
         data.params = Object.assign({}, data)
         data.categoryId = this.categoryId
         data.modelId = this.modelId
         data.status = this.status
         if (!this.rowId) {
           const json = JSON.stringify(data)
           save(json).then(response => {
             this.message(response)
           })
         } else {
           data.id = this.rowId
           const json = JSON.stringify(data)
           update(json).then(response => {
             this.message(response)
           })
         }
      },
      message (response) {
        if (response.code === 0) {
          this.$message.info(response.msg)
          this.$emit('ok')
          this.handleCancel()
        } else {
          this.$message.error(response.msg)
        }
      },
      handleCancel () {
        this.$refs.modalDynamicForm.handleCancel()
      }
    }
  }
</script>
